<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8"/>
    <title>Title</title>
    <link rel="stylesheet" type="text/css" href="index.css"/>
</head>
<body>
<div class="board"><!--整体-->
    <div class="blackbar"></div><!--MacBook Air的底座-->
    <div class="keyboard"><!--键盘-->
        <ul>
            <li></li>
            <li></li>
            <li></li>
            <li></li>
            <li></li>
            <li></li>
            <li></li>
            <li></li>
            <li></li>
            <li></li>
            <li></li>
            <li></li>
            <li></li>
            <li></li>
            <li><span>~</span><span>、</span></li>
            <li><span>!</span><span>1</span></li>
            <li><span>@</span><span>2</span></li>
            <li><span>#</span><span>3</span></li>
            <li><span>$</span><span>4</span></li>
            <li><span>%</span><span>5</span></li>
            <li><span>^</span><span>6</span></li>
            <li><span>&</span><span>7</span></li>
            <li><span>*</span><span>8</span></li>
            <li><span>(</span><span>9</span></li>
            <li><span>)</span><span>0</span></li>
            <li><span>—</span><span>-</span></li>
            <li><span>+</span><span>=</span></li>
            <li>delete</li>
            <li>Tab</li>
            <li>Q</li>
            <li>W</li>
            <li>E</li>
            <li>R</li>
            <li>T</li>
            <li>Y</li>
            <li>U</li>
            <li>I</li>
            <li>O</li>
            <li>P</li>
            <li></li>
            <li></li>
            <li></li>
            <li></li>
            <li>A</li>
            <li>S</li>
            <li>D</li>
            <li>F</li>
            <li>G</li>
            <li>H</li>
            <li>J</li>
            <li>K</li>
            <li>L</li>
            <li></li>
            <li></li>
            <li></li>
            <li>shift</li>
            <li>Z</li>
            <li>X</li>
            <li>C</li>
            <li>V</li>
            <li>B</li>
            <li>N</li>
            <li>M</li>
            <li></li>
            <li></li>
            <li></li>
            <li>shift</li>
            <li></li>
            <li></li>
            <li></li>
            <li></li>
            <li></li>
            <li></li>
            <li></li>
            <li></li>
            <li></li>
            <li></li>
            <li></li>
        </ul>
    </div>
    <div class="touch"></div><!--触控板-->
</div>
</body>
</html>